<mat-toolbar class="header-toolbar" color="#ffffff" style="box-shadow: 3px 2px 5px #888888;">
  <div class="nav-wrapper">
    <!-- Logo -->
    <div class="logo-wrapper">
      <a routerLink="/">
        <img class="logo" src="../assets/img/logo.png" alt="" />
      </a>
      <div class="logo-text">
        <h1 class="logo-text">Lampta</h1>
      </div>
    </div>
    <!-- SearchBar -->
    <form class="search-container">
      <input type="text" id="search-bar" placeholder="请输入要搜索的内容...">
      <a href="#">
        <img class="search-icon" src="http://www.endlessicons.com/wp-content/uploads/2012/12/search-icon.png">
      </a>
    </form>

    <!-- Userinfo -->
    <div class="userinfo" style="height: 64px">
      <ul>
        <li>
          <a id="menu1" href="/programas/" target="_self">购物车</a>
        </li>
        <li>
          <a id="menu1" href="/programas/" target="_self">登录/注册</a>
        </li>
        <li>
          <a id="menu1" href="/programas/" target="_self">
            <img src="../../assets/img/avatar.png" width="40px" alt="">
          </a>
        </li>
      </ul>
    </div>

  </div>
</mat-toolbar>